<template>
	<view class="page-student-box">
		<c-base-section :title="'我的请假条'" :iconType="'wallet-filled'" :showMore="false">
			<uni-list v-if="tableData && tableData.length > 0">
				<template v-for="item in tableData">
					<uni-list-item class="student-item" :clickable="true" @click="skipToDetail(item)">
						<view slot="body" class="item-body">
							<view class="cut f14">
								<text class="col_danger mrgr5" v-if="item.isLeaveSchool">[离校]</text>
								<text class="col_primary mrgr5" v-else>[留校]</text>
								{{ item.title }}
							</view>
							<view class="cut mrgt5 col9 f13">{{ item.description }}</view>
						</view>
						<view slot="footer" class="item-footer">
							<uni-tag :text="item.statusDesc" type="primary" v-if="item.status === valAskPending()"></uni-tag>
							<uni-tag :text="item.statusDesc" type="success" v-if="item.status === valAskPassed()"></uni-tag>
							<uni-tag :text="item.statusDesc" type="error" v-if="item.status === valAskRefused()"></uni-tag>
							<uni-tag :text="item.statusDesc" type="info" v-if="item.status === valAskCanceled()"></uni-tag>
						</view>
					</uni-list-item>
				</template>
				<!--<uni-list-item class="student-item">
					<view slot="body" class="item-body">
						<view class="cut f14"><text class="col_primary mrgr5">[留校]</text>想过六一儿童节，请假陪娃玩耍，请批准，我只玩儿一天，傍晚就回来</view>
						<view class="cut mrgt5 col9 f13">今天是个好天气，处处好风光，好风光，城里的月光照亮了蓝润华府春天</view>
					</view>
					<view slot="footer" class="item-footer">
						<uni-tag text="通过" type=""></uni-tag>
					</view>
				</uni-list-item>-->
			</uni-list>
			<c-base-empty :show="totalCount <= 0"></c-base-empty>
		</c-base-section>
		<c-base-pagination :total="totalCount" @change="getDataList"></c-base-pagination>
	</view>
</template>

<script>
	export default {
		name: "pageStudent",
		data() {
			return {
				totalCount: 0,
				tableData: [],
				listQuery: {
					type: null,
					status: null,
					beginDate: "",
					endDate: "",
					classId: "",
					keywords: "",
					page: 1,
					size: 10
				}
			}
		},
		mounted() {
			this.initData()
		},
		methods: {
			initData() {
				this.getDataList()
			},
			getDataList(current) {
				this.listQuery.page = current || this.listQuery.page
				this.httpGet({
					url: this.$apis.apiAskLeaveList,
					params: this.listQuery
				}).then(res => {
					if (res.success) {
						this.totalCount = res.result.totalCount
						this.tableData = res.result.items
					}
				})
			},
			skipToDetail(row) {
				console.log(row)
				this.mxNavigateTo("/pages/student/vacateDetail?id=" + row.id)
			}
		}
	}
</script>

<style scoped lang="scss">
	.page-student-box {
		.student-item {
			display: flex;
			justify-content: space-between;
			.item-body {
				flex: 3.5;
				max-width: 75%;
			}
			.item-footer {
				flex: 1.5;
				max-width: 25%;
				text-align: right;
			}
		}
	}
</style>
